const AnchorNav = {
  setCurrentMenuItem () {
    // select all titles with an id in the main element.
    // this selection could be narrowed depending on the way the anchoring is implemented:
    const sections = document.querySelectorAll('main h2[id]');
    const scrollOffset = 100;
    // Listen to the scroll
    window.onscroll = () => {
      const scrollPos = document.documentElement.scrollTop || document.body.scrollTop;
      for (let s in sections) {
        // if a section pops in the viewport, the current active class is removed
        // and applied to this new appearing section:
        if (sections.hasOwnProperty(s) && sections[s].offsetTop <= scrollPos - scrollOffset) {
          const id = sections[s].id;
          let currentItem = document.querySelector('main .menu__item--active')
          if (currentItem) currentItem.classList.remove('menu__item--active');
          document.querySelector(`a[href*=${id}]`).classList.add('menu__item--active');
        }
      }
    }
  }
}

export default AnchorNav
